<template>
  <div id="exampleView">
    <CodeEditor :value="codeValue" :handle-change="OnCodeChange" />
    <MDeditor
      :value="mdValue"
      :handle-change="OnMDChange"
      style="height: 400px"
    />
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue";
import MDeditor from "@/components/MdEditor.vue";
import CodeEditor from "@/components/CodeEditor.vue"; // @ is an alias to /src

const codeValue = ref();
const mdValue = ref();
const OnMDChange = (v: string) => {
  mdValue.value = v;
  console.log(v);
};
const OnCodeChange = (v: string) => {
  codeValue.value = v;
  console.log(v);
};
</script>
<style>
. bytemd-toolbar-icon bytemd-tippy bytemd-tippy-right:last-child {
  display: none;
}
</style>
